import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Table } from 'antd'
import moment from 'moment'
import style from './SameModal.module.less'

// 获取表格字段配置
function getColumns () {
  return [
    {
      title: '序号',
      dataIndex: 'key',
      key: 'index',
      align: 'center',
      width: 60
    },
    {
      title: '案号',
      dataIndex: 'caseno_desc',
      key: 'caseno_desc',
      width: 150,
      render: (v, l) => {
        return (
          <span className={style.link} onClick={() => this.props.toDetail(l)}>{v || l.acceptno_desc}</span>
        )
      }
    },
    {
      title: '申请人',
      dataIndex: 'applicant_name',
      key: 'applicant_name'
    },
    {
      title: '被申请人',
      dataIndex: 'respondent_name',
      key: 'respondent_name'
    },
    {
      title: '经办秘书',
      dataIndex: 'processer',
      key: 'processer',
      width: 100
    },
    {
      title: '案件状态',
      dataIndex: 'status',
      key: 'status',
      width: 100
    },
    {
      title: '立案时间',
      dataIndex: 'docket_datetime',
      key: 'docket_datetime',
      width: 120,
      render: v => {
        return v ? moment(v * 1000).format('YYYY-MM-DD') : ''
      }
    }
  ]
}

export default class SameModal extends Component {
  formatList () {
    return this.props.list.map((li, i) => {
      li.key = i + 1
      return li
    })
  }

  render () {
    const list = this.formatList()
    const columns = getColumns.call(this)
    return (
      <div className={style.container}>
        <div className={style.title}>类案列表</div>
        <Table columns={columns} loading={this.props.loading} scroll={{ y: 300 }} dataSource={list} pagination={false} />
      </div>
    )
  }
}

SameModal.propTypes = {
  list: PropTypes.array,
  loading: PropTypes.bool,
  // eslint-disable-next-line react/no-unused-prop-types
  toDetail: PropTypes.func
}
SameModal.defaultProps = {
  list: [],
  loading: false,
  toDetail: () => {}
}
